import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'  /**如果是 js 就没问题；因为用的是 ts，所以要安装node 的原生模块 path，运行命令 yarn add @types/node -D  ; @types 表示是开发依赖 */

/**vite 导入 Element-plus 安装自动导入所需组件的插件  */
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),
  ],
  resolve: {
    alias: {
      /**当使用文件系统路径的别名时，请始终使用绝对路径。相对路径的别名值会原封不动地被使用，因此无法被正常解析。也可以像vue2一样，通过插件实现 @ 路径 */
      "@": path.resolve(__dirname, './src')  /**@ 符号指向src */
    }
  },
  // http://xue.cnkdl.cn:9082/mall-admin
  server: {
    proxy: {
      // 字符串简写写法：http://localhost:5173/foo -> http://localhost:4567/foo
      // '/foo': 'http://localhost:4567',

      // 带选项写法：http://localhost:5173/api/bar -> http://jsonplaceholder.typicode.com/bar
      '/api': {
        // target: 'http://jsonplaceholder.typicode.com',
        target: 'http://xue.cnkdl.cn:9082/mall-admin',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ''),
      },
    },
    hmr: {
      overlay: false,
    }
  }
})
